<!DOCTYPE html>
<html lang="en">

<head>
	<!-- 预加载,浏览器提前加载指定资源(不执行),被使用到时不会再次请求，优先级高-->
	<link rel="preload" as="script" href="./index.js">
	<!-- 预加载,浏览器会在空闲时加载(不执行),被使用到时不会再次请求，优先级低-->
	<link rel="prefetch" as="script" href="./index.js">
</head>

<body>
	async defer 只适用于外部脚本文件（使用 src 属性引入的脚本）
	<!-- async --不阻止DOM解析，下载完成后立即执行。不保证执行顺序。-->
	<script src="./test.js" async></script>
	<!-- defer 不阻止DOM解析，DOM解析完后(DOMContentLoaded事件调用前)执行，按声明顺序执行。-->
	<script src="./test.js" defer></script>
	<!--type为module时,默认为defer。-->
	<script src="./test.js" type="module"></script>
	<script>
		let script = document.createElement('script');
		// index.js 已经被预加载,此处不会再次发起请求
		script.src = './index.js';
		// 通过脚本动态创建的 script 标签默认 async 属性为 true
		console.log(script.async)
	</script>
</body>

</html>